import { ref, computed } from "vue";
import { defineStore } from "pinia";

const USER_KEY = "USER_KEY";

export const useUserStore = defineStore("user", () => {
  // 用户信息
  const _user = ref({});
  const menus = ref([]);
  ruleNames = ref([]);

  const user = computed(() => {
    // 如果 user 为空就从 localStorage 中读取
    if (JSON.stringify(_user.value) === "{}") {
      let user_str = localStorage.getItem(USER_KEY);
      if (user_str) {
        _user.value = JSON.parse(user_str);
      }
    }
    return _user.value;
  });

  const setUserInfo = (user) => {
    // 保存用户信息
    _user.value = user;
    localStorage.setItem(USER_KEY, JSON.stringify(user));
  };

  const removeUser = () => {
    // 清除用户信息
    _user.value = {};
    localStorage.removeItem(USER_KEY);
  };

  const setMenus = (menus) => {
    // 保存用户信息
    menus.value = menus;
    
  };

  return { user, setUserInfo, removeUser, setMenus, menus};
});

export const useLayoutStore = defineStore("layout", () => {
  const asideWidth = ref("250px");


  const isCollapse = computed(() => asideWidth.value == "64px");
  const handleAsideWidth = () => {
    asideWidth.value = asideWidth.value == "250px" ? "64px" : "250px";
  };

  return { asideWidth, handleAsideWidth, isCollapse};
});
